<template>
    <MgsLyGrid :grid="grid" style="height: 100%">123456</MgsLyGrid>
</template>

<script>
import MgsLyGrid from '@mgs/components-layout/mgs-ly-grid.vue';

export default {
    components: { MgsLyGrid },
    data() {
        return {
            grid: {
                tag: 'el-container',
                children: [
                    {
                        tag: 'el-aside',
                    },
                    {
                        tag: 'el-container',
                        props: {
                            direction: 'vertical',
                        },
                        children: [
                            {
                                tag: 'el-header',
                            },
                            {
                                tag: 'el-main',
                            },
                            {
                                tag: 'el-footer',
                            },
                        ],
                    },
                ],
            },
        };
    },
};
</script>

<style lang="scss">
body {
    margin: 0;
    position: absolute;
    width: 100%;
    height: 100%;
}
</style>
